<template>
    <div style="margin: 20px;">
        <el-container>           
        <el-header >        
          <span style="font-size:60px">收费员日结</span>
          <el-link type="primary" href="/#/initMain" style="float:right"><b>返回首页</b></el-link>
        </el-header>
        <el-main style="text-align:left">               
            <span ><b>时间范围</b></span><br/>
            <div>
              <el-row>
                <el-col span="8">
              <el-date-picker
                v-model="dates"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期">
              </el-date-picker>
                </el-col >
                <el-col span="8">
                  <el-button type="primary" @click="submitForm" icon="el-icon-document-checked">日结统计</el-button>
                </el-col>
              </el-row>
 
            </div>
                
                
              </el-main>
            </el-container>
   </div>
</template>

<style>
  .el-header {
    background-color: rgb(217, 228, 243);
    color: #333;
    line-height: 60px;
    
  }
</style>

<script>
  export default {
    
    methods: {
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
            if (valid) {
                alert('submit!');
            } else {
                console.log('error submit!!');
                return false;
            }
        });
    },

    },
    data() {
      return {
        dates:[],
      }
    }
  }
</script>